import React from 'react';
import { connect } from 'dva';
import styles from './ExecList.css';
import { Card, Input, Table, Button, Icon } from 'antd';
import EditExec from '../../../components/edit/EditExec';
const { Search } = Input;

function ExecList({ datas, pageSize, currentPage, totalCount, loading, dispatch, params }) {
  function loadList(page, pageSize, queryStr) {
    dispatch({ type: 'execMgr/listTurnToPage', payload: { execType: params.execType, currentPage: page, pageSize: pageSize, queryStr: queryStr } });
  }
  // const rowSelection = {
  //   onChange: (selectedRowKeys, selectedRows) => {
  //     console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
  //   },
  //   getCheckboxProps: record => ({
  //     // disabled: record.name === 'Disabled User',    // Column configuration not to be checked
  //   }),
  // };
  function createHandler(values) {
    dispatch({
      type: 'execMgr/create',
      payload: values
    })
    loadList();
  }
  function updateHandler(values) {
    dispatch({
      type: 'execMgr/update',
      payload: values
    })
    loadList();
  }
  let clmConfigs = [
    {
      title: '代码',
      dataIndex: 'id',
      key: 'id',
      render: (text, record) => <EditExec onOk={updateHandler.bind(null)} record={record}> <a>{text}</a></EditExec>,
    },
    {
      title: '名称',
      dataIndex: 'name',
      key: 'name',
    },
    {
      title: '联系人',
      dataIndex: 'linkMan',
      key: 'linkMan',
    },
    {
      title: '电话',
      dataIndex: 'linkPhone',
      key: 'linkPhone',
    },
    {
      title: '公司地址',
      dataIndex: 'address',
      key: 'address',
    },
    {
      title: '收货地址',
      dataIndex: 'shippingAddress',
      key: 'shippingAddress',
    },
    {
      title: '负责人',
      dataIndex: 'manageUserName',
      key: 'manageUserName'
    },
  ];
  const pagination = {
    current: currentPage,
    pageSize: pageSize,
    onChange: loadList,
    total: totalCount,
    showTotal: (t) => `总计：${t}`,
  };
  return (
    <div className={styles.normal}>
      <Card>
        <Search
          placeholder="请输入查询条件"
          size="large"
          style={{ width: 300 }}
          onSearch={value => loadList(1, pageSize, value)} />
        <EditExec onOk={createHandler.bind(null)}><Button className={styles.fnBtn} type="primary" >添加</Button></EditExec>
        <Button type="danger">删除</Button>
      </Card>
      <Table
        pagination={pagination}
        columns={clmConfigs}
        loading={loading}
        dataSource={datas}
        rowKey="id"
        bordered />
    </div>
  );
}

function mapStateToProps(state) {
  return {
    datas: state.execMgr.list.datas,
    pageSize: state.execMgr.list.pageSize,
    currentPage: state.execMgr.list.currentPage,
    totalCount: state.execMgr.list.totalCount,
    loading: state.loading.models.execMgr
  };
}

export default connect(mapStateToProps)(ExecList);
